import React, { Component } from 'react'
import { Button , Tooltip} from 'antd';
// 按钮的字体图标
import { SearchOutlined } from '@ant-design/icons';
export default  function mybutton(params) {
    const myclick = (params) => {
        alert('被点击了')
    }
        return (
            <div>
                {/* 同一个操作区域最多出现一次。
                通过设置 Button 的属性来产生不同的按钮样式，
                推荐顺序为：type -> shape -> size -> loading -> disabled
                type 按钮的类型,样式
                shape 按钮是不是圆的 circle圆的,不能有字 round 圆角
                icon ,可以将按钮变成图标,或者是添加图标
                size="large" 按钮的大小  large small 不设置为中
                href 可以添加跳转路径
                disabled 添加,即可让按钮不可用
                loading={false} 按钮不载入 默认是true
                ghost 设置透明按钮
                */}
                <Button  type="primary" icon={<SearchOutlined />} >主按钮 </Button>
                <Button shape="circle">次按钮</Button>
                <Button type="dashed" shape="round" >虚线 Button</Button>
                <br />
                <Button type="text" loading={false}>文本按钮</Button>
                <Button type="link" href="https://www.baidu.com" >连接Button</Button>
                {/* Tooltip  提示信息   */}
                {/* 当需要在 Button 内嵌入 Icon 时，可以设置 icon 属性，
                或者直接在 Button 内使用 Icon 组件。
                如果想控制 Icon 具体的位置，只能直接使用 Icon 组件，而非 icon 属性。 */}
                <Tooltip title="search">
                    <Button  onClick={myclick}  shape="circle"  icon={<SearchOutlined />} />
                </Tooltip>
            </div>
        )
    
    
}
